<template>
  <div class="profile-gender">
    <van-picker
        show-toolbar
        :columns="columns"
        :default-index="profileGender"
        @cancel="$emit('close')"
        @confirm="onConfirm"
        @change="onChange"
    />
  </div>
</template>

<script>
import {updateUserProfile} from "@/api/user";

export default {
  name: "profileGender",
  props:{
    gender:{
      type:Number,
      required:true
    }
  },
  data(){
    return{
      profileGender:this.gender,
      columns: ['女', '男']
    }
  },
  methods:{
    onChange(picker,value,index){
      this.profileGender=index
    },
    async onConfirm() {
      this.$toast.loading({
        message:'保存中',
        forbidClick:true
      })
      try {
        await updateUserProfile({
          gender: this.profileGender
        })
        this.$toast.success('保存成功')
        this.$emit('update-gender',this.profileGender)
        this.$emit('close')
      }catch (err){
      }
    },
  }
}
</script>

<style scoped lang="less">
/deep/.van-nav-bar__content{
  background-color: #3a8ee6;
}
</style>